import { createTheme } from '@mui/material';

export const theme = createTheme({
    typography: {
        h1: { fontStyle: 'normal', fontWeight: '500', fontSize: '32px', lineHeight: '48px' },
        h2: { fontStyle: 'normal', fontWeight: 'bold', fontSize: '24px', lineHeight: '36px' },
        h3: { fontStyle: 'normal', fontWeight: '300', fontSize: '24px', lineHeight: '36px' },
        h4: { fontStyle: 'normal', fontWeight: 'bold', fontSize: '16px', lineHeight: '26px' },
        h5: { fontStyle: 'normal', fontWeight: 'bold', fontSize: '16px', lineHeight: '24px' },
        h6: { fontStyle: 'normal', fontWeight: 'normal', fontSize: '14px', lineHeight: '21px' },
        body1: { fontStyle: 'normal', fontWeight: 'normal', fontSize: '16px', lineHeight: '24px' },
        subtitle1: {
            fontStyle: 'normal',
            fontWeight: 'normal',
            fontSize: '14px',
            lineHeight: '22px',
        },
        subtitle2: {
            fontStyle: 'normal',
            fontWeight: 'normal',
            fontSize: '10px',
            lineHeight: '22px',
        },
    },
    components: {
        MuiButton: {
            styleOverrides: {
                root: {
                    fontStyle: 'normal',
                    fontWeight: 'normal',
                    fontSize: '14px',
                    lineHeight: '24px',
                },
            },
        },
        MuiOutlinedInput: {
            styleOverrides: {
                input: {
                    '&::placeholder': {
                        fontSize: '14px',
                    },
                },
            },
        },
    },
});
